// Home页面卡片样式

// 卡片背景颜色
$card-bg-color: #fff;

// 定义hover时的颜色
$hover-color: #1890ff;

.home-card {
  // 定义卡片样式
  width: 80%;
  margin: 0 auto;
  margin-top: 30px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.3s;

  // 定义卡片的背景颜色
  background-color: $card-bg-color;

  // 定义卡片的内边距
  padding: 20px;

  // 定义hover时的卡片样式
  &:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);

    // 定义hover时的卡片背景颜色
    background: linear-gradient(
                    135deg,
                    $hover-color,
                    lighten($hover-color, 15%)
    );
  }
}
